import { useState } from 'react'

//项目的根组件

// const arr=['测试1','测试2','测试3','测试4']
// const isLogin=false
//定义组件，函数名首字母需要大写
// function ButtonComp(){
//   return <button onClick={(e)=>getName(e,'adc')}>点击我</button>
// }
// function compare(){
//   return isLogin ? <div>已登录</div>:<div>未登录</div>
// }
// function getName(e, name){
//   console.log(e, name)
// }
function App() {
  //useState函数用于添加一个状态变量
  // let [count,setCount] = useState(0)
  let [obj,setObj] = useState({name:'yx'})
  // function addCount(){
  //   setCount(count+1)
  // }

  //修改对象，需要把原来的对象重新传入，再下面写入需要修改的属性，覆盖之前的属性（注意：set方法修改对象或数组时，需要传入新的对象或数组，不修改原来的对象或数组）
  const updateObj=()=>{
    setObj({
      ...obj,
      name:'yt'
    })
  }
  return (
    <div className="App">
      {/* <div>{arr.map((item,index)=><div key={index}>{item}</div>)}</div> */}
      {/* {compare()} */}
      {/* 函数传参，e为原生对象,另一个为任意参数 */}
      {/* <button onClick={(e)=>{ getName(e, 'me') }}>点击我</button> */}
      {/* <ButtonComp></ButtonComp>
      <ButtonComp/> */}
      {/* <button onClick={addCount}>{count}</button> */}
      <button onClick={updateObj}>{obj.name}</button>
    </div>
  );
}

export default App;
